<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=places&sensor=false">
    //Esto carga el Places Library, necesario para el autocompletado de direcciones texto
</script>

<?php
//Código para el idioma
    if($leng == "en")
    {
        include_once APP_PATH.'libs/en.php';
    }
    else
    {
        include_once APP_PATH.'libs/es.php';
    }
    
//Incluimos el Geocomplete plugin Jquery
echo Tag::js('jquery.geocomplete.min');
?>

<script type="text/javascript">
    $(document).ready(function(){
        
        // Activar la autocompletacion de direcciones
        $("#geocomplete").geocomplete({
        map: ".map_canvas",
        //details: "ul",
        details: "form",
        detailsAttribute: "data-geo"
        });
        
        $(".btn-ingresar").hide();
        
        $("#geocomplete").change(function()
        {
            $(".btn-ingresar").show();
        });
        
        $("#geocomplete").focusout(function()
        {
            $(".btn-ingresar").show();
        });
        
       $(".btn-ingresar").click(function(){
           //Juntamos nombre de la calle mas el numero si existe
           if ($(".numerocalle").val() != '')
               var direccion_completa = $(".direccion").val() + ' '+ $(".numerocalle").val();
           else
               var direccion_completa = $(".direccion").val();
           
           //Separamos las coordenadas y las guardamos en variables
           var coordenadas_juntas = $(".coordenadas").val();
           var coordenadas_separadas = coordenadas_juntas.split(",");
           var latitud = coordenadas_separadas[0];
           var longitud = coordenadas_separadas[1];
           
           //Datos preparados son asignados a las variables del form a enviar
           $(".direccion").val(direccion_completa);
           $(".latitud").val(latitud);
           $(".longitud").val(longitud);
           
           if ($(".ciudad").val() == '')
           {
               alert('<?php echo $ubicacion_ingresar_valciudad; ?>')
               return false;
           }
           if ($(".direccion").val() == '')
           {
               alert('<?php echo $ubicacion_ingresar_valcalle; ?>')
               return false;
           }
           
//           alert ('Si ves esto, los datos se ingresarian');
        });
        
    });
</script>

<style type="text/css">
  
  .map_canvas:after{
  content: "<?php echo $ubicacion_ingresar_titulo1; ?>";
  padding-top: 170px;
  display: block;
  text-align: center;
  font-size: 2em;
  color: #999;
}

</style>
    
<div align="center">
    <table>
        <tr>
            <td><?php echo $usuario_buscar_centro ?>:&nbsp;</td>
            <td><?php echo $nombre_cliente; ?></td>
        </tr>
    </table>
    <br><h6><?php echo $ubicacion_ingresar_titulo2; ?></h6>
        
    <?php echo Form::open('ubicacion/ingresar/'.$leng) ?>
        <table>
            <tr>
                <td>
                    
                </td>
                <td>
                   <input id="geocomplete" type="text" placeholder="<?php echo $ubicacion_ingresar_ubi; ?>" value="" class="span6"/><br>
                   <?php echo Form::submit(''.$ubicacion_ingresar_submit.'', 'class="btn-ingresar btn btn-warning"')?><hr>
                </td>
            </tr>
        </table>
        
        
        
    <div class="map_canvas" style="width:400px; height:400px"></div>
        
    <?php
        echo Html::link("ubicacion/ingresar_mapa/".$leng, ''.$ubicacion_ingresar_link.'');
  
        echo Form::hidden('ubicacion.latitud_ubi','class="latitud"');
        echo Form::hidden('ubicacion.longitud_ubi','class="longitud"');
        echo Form::hidden('coordenadas','class="coordenadas" data-geo="location"');
        echo Form::hidden('numerocalle','class="numerocalle" data-geo="street_number"');
        echo Form::hidden('ubicacion.direccion_ubi','class="direccion" data-geo="route"');
        echo Form::hidden('ubicacion.ciudad_ubi','class="ciudad" data-geo="locality"');
        echo Form::hidden('ubicacion.region_ubi','class="region" data-geo="administrative_area_level_1"');
        echo Form::hidden('ubicacion.id_usu','',$id_usu);
        echo Form::hidden('ubicacion.estado_ubi','','1');
    ?>
            
        
    </form>
</div>